// 头部
.header {
  // 导航
  .nav {
    .van-sticky {
      width: 300rpx;
    }
    // 轮播
    .swiper-container {
      margin: 20rpx;
      border-radius: 15rpx;
      .swp-item {
        border-radius: 15rpx;
        // background-color: pink;
        image {
          width: 100%;
          height: 100%;
          border-radius: 10rpx
        }
      }
    }
    // 分类导航
    .classify-nav {
      display: flex;
      height: 150rpx;
      margin: 0 50rpx;
      border-bottom: 3rpx solid #eee;
      // background-color: pink;
      .class-item {
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
      }
      .class-icon {
        width: 90rpx;
        height: 90rpx;
        // background-color: skyblue;
        image {
          width: 100%;
          height: 100%;
        }
      }
      text {
        font-size: 25rpx;
      }
    }
    // 畅销佳作
    .boom-goods {
      margin: 20rpx;
      margin-top: 40rpx;
      // 畅销内容
      .boom-content {
        display: flex;
        .boom-item {
          width: 160rpx;
          margin-top: 20rpx;
          margin-right: 20rpx;
          // background-color: pink;
          .cover {
            width: 100%;
            height: 200rpx;
            border-radius: 13rpx;
          }
          .boom-name {
            font-size: 22rpx;
            margin: 6rpx 0;
          }
          .boom-author {
            color: #909499;
            font-size: 20rpx;
          }
        }
      }
    }
    // 小说速递
    .speed-give {
      margin: 20rpx;
      margin-top: 40rpx;
      // 其他作品
      .other-works {
        display: flex;
        .boom-item {
          width: 160rpx;
          margin-top: 40rpx;
          margin-right: 20rpx;
          .cover {
            width: 160rpx;
            height: 200rpx;
            border-radius: 13rpx;
          }
          .boom-name {
            font-size: 30rpx;
          }
        }
      }
    }
    // 极品好书
    .good-works {
      margin: 20rpx;
      margin-top: 40rpx;
    }
    // 经典热书
    .hot-works {
      margin: 20rpx;
      margin-top: 40rpx;
    }
    // 畅销标题
    .boom-title {
      display: flex;
      align-items: center;
      justify-content: space-between;
      text:nth-child(1) {
        font-weight: 600;
      }
      .more {
        color: #677db9;
        font-size: 25rpx;
        .iconfont {
          color: #677db9;
          font-size: 25rpx;
        }
      }
    }
    // 详细作品
    .work-item {
      display: flex;
      height: 200rpx;
      margin-top: 20rpx;
      // 作品封面
      .cover {
        width: 160rpx;
        margin-right: 15rpx;
        image {
          width: 160rpx;
          height: 200rpx;
          border-radius: 13rpx;
        }
      }
      // 作品信息
      .work-message {
        display: flex;
        flex-direction: column;
        justify-content: center;
        height: 100%;
        font-size: 24rpx;
        .work-dec {
          margin: 18rpx 0;
          color: #7c7c7c;
        }
        .work-name {
          font-size: 30rpx;
          font-weight: 600;
        }
        .work-style {
          display: flex;
          justify-content: space-between;
          .work-author {
            color: #6e6e6e;
          }
          .category {
            color: #677db9;
          }
        }
      }
    }
    
  }
  // 搜索
  .search {
    display: flex;
    align-items: center;
    position: absolute;
    right: 60rpx;
    top: 20rpx;
    width: 300rpx;
    height: 60rpx;
    // background-color: pink;
    border-radius: 30rpx;
    .search-left {
      height: 95%;
      flex: 1;
      line-height: 55rpx;
      border-bottom-left-radius: 30rpx;
      border-top-left-radius: 30rpx;
      border: 1px solid #cdcdcd;
      border-right: 0;
      .iconfont {
        padding: 0 10rpx;
        vertical-align: bottom;
        font-weight: 700;
        color: #959595;
      }
      .search-text {
        font-size: 25rpx;
        color: #cdcdcd;
      }
    }
    .search-right {
      padding: 0 20rpx;
      height: 100%;
      line-height: 55rpx;
      color: #fff;
      font-size: 27rpx;
      border-bottom-right-radius: 30rpx;
      border-top-right-radius: 30rpx;
      background-color: #476fde;
    }
  }
}